<template>
  <div class="maintainCon" >
    <div class="errorContent fix">
      <div class="maintain fix">
        <div class="left">
          <img src="../../assets/img/maintainError.png" alt="" width="160" height="107">
        </div>
        <div class="right" v-loading="loading">
          <h1>系统维护中......</h1>
          <p>每一次简单的维护都是为了给您带来更好的服务</p><!-- {{Maintain}} data.msg  data.data  .serviceUrl-->
          <p  v-if="maintainTime">预计于<span class="color-danger">  {{maintainTime}}  </span>维护完成</p>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      timer: null,
      maintainTime: '2020-10-11 13:12:32',
      loading: true
    }
  }
}
</script>

<style scoped>
.maintainCon{
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:80%;
  display:table;
}
.errorContent{
  display: table-cell;
  vertical-align: middle;
}
.maintain{
  width:526px;
  margin:0 auto;
  & >div{
    float:left;
  }
  & .right{
    text-align:left;
    padding-left:66px;
    & h1{
      font-size:32px;
      color:#59adf2;
      font-weight:400;
    }
    & p{
      line-height:1.8;
      font-size:14px;
      color:#666666;
      & em{
        color:red;
        margin:0 4px;
      }
    }
    & > a{
      font-size:14px;
      border:1px solid;
      border-radius:4px;
      padding:5px 12px;
      color:#45aeef;
    }
  }
}
</style>
